<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>打印纸申请-云校通-教师</title>
<jsp:include page="/WEB-INF/page/common/_header.jsp"></jsp:include>
<script src="<%=basePath %>/js/workApproval/hide.js"></script>
<body ontouchstart id="tjjsqj">

	<div class="weui_tab tab-bottom">
		<div class="weui-header bg-blue"> 
	  		<div class="weui-header-left">
	  		 	<a onclick="back()" href="javascript:;" class="icon icon-109 f-white">返回</a > 
	  		</div>
	    	<h1 class="weui-header-title">打印纸申领</h1>
	    </div>
		<div class="weui_tab_bd">
	        <div class="weui_cells" style="margin-top:0;">
				<div class="weui_cell">
					<div class="weui_cell_hd">
						<label class="weui_label">打印纸用途</label>
					</div>
					<div class="weui_cell_bd weui_cell_primary">
						<input class="weui_input" id="printingPaperUse" placeholder="如：日常办公、教案、上交材料..."/>
					</div>
				</div>
				
				<div class="weui_cell">
					<div class="weui_cell_hd">
						<label class="weui_label">使用地点</label>
					</div>
					<div class="weui_cell_bd weui_cell_primary">
						<input class="weui_input" id="usePosition" placeholder="(必填)"/>
					</div>
				</div>
			</div>
	        
	        <div class="weui_cells borderLeft xtbg-add-list" style="margin-top:0;">
	        <div id="getHtml">
	        	<div class="no no-1">
					<div class="weui_cell xtbg-add-list-title">
						<div class="weui_cell_bd weui_cell_primary">
							<p class="f14">打印纸明细(<span class="xtbg-add-sort sNum">1</span>)</p>
						</div>
					</div>
					<div class="weui_cell weui_template">
						<div class="weui_cell_hd">
							<label class="weui_label weui_template_text">数量 (包)</label>
						</div>
						<div class="weui_cell_bd weui_cell_primary">
							<input type="number" pattern="[0-9]*" class="weui_input weui_template_val" placeholder="请输入数量 (必填)"/>
						</div>
					</div>
					<div class="weui_cell weui_template">
						<div class="weui_cell_hd">
							<label class="weui_label weui_template_text">纸的颜色</label>
						</div>
						<div class="weui_cell_bd weui_cell_primary">
							<select class="weui_select weui_template_val">
				              	  <option value="">请选择</option>
				                  <option value="白色">白色</option>
				                  <option value="粉色">粉色</option>
				                  <option value="其他">其他</option>
				            </select>
						</div>
					</div>
	        	</div>
	        </div>
	            <div class="xtbg-add-btnWrap tcenter f-blue f17" id="nBtn">
		        	+ 增加明细
		        </div>
		        <div class="bg-f8 f-14 pl15 pr10 pb5">必须以科组、级组或处室为单位申请，审批人是韩主任。</div>
	        </div>
	        
			<div class="weui_cells  weui_cells_access mt0">
				<div class="weui_cell" id="check">
					<div class="weui_cell_bd absolut">
	                    <p>审批人</p>
	                </div>
				</div>
				<div class="gzsp_wrap">
					<ul></ul>
					<div><span id="addBtn" class="add"></span></div>
				</div>
			</div>
			
	       <div class="weui_btn_area mb55">
		        <a href="javascript:" class="weui_btn bg-blue" id="btnSubmit">提交申请</a>
		    </div>
		</div>
	</div>
		
		
	<template id="add-element-temp">
		<div class="weui_cell xtbg-add-list-title">
            <div class="weui_cell_bd weui_cell_primary">
                <p class="f14">打印纸明细(<span class="xtbg-add-sort nub">1</span>)</p>
            </div>
        </div>
		<div class="weui_cell weui_template">
			<div class="weui_cell_hd">
				<label class="weui_label weui_template_text">数量 (包)</label>
			</div>
			<div class="weui_cell_bd weui_cell_primary">
				<input type="number" pattern="[0-9]*" class="weui_input weui_template_val" placeholder="请输入数量 (必填)"/>
			</div>
		</div>
		<div class="weui_cell weui_template">
			<div class="weui_cell_hd">
				<label class="weui_label weui_template_text">纸的颜色</label>
			</div>
			<div class="weui_cell_bd weui_cell_primary">
				<select class="weui_select weui_template_val">
	              	  <option value="">请选择</option>
	                  <option value="白色">白色</option>
	                  <option value="粉色">粉色</option>
	                  <option value="其他">其他</option>
	            </select>
			</div>
		</div>
	    <div class="delete">
			<p>删除</p>
	    </div>
	</template>
	
	<!--弹窗-->				
	<div class="weui_mask ueureiu weui_mask_visible" style="display: none;z-index:600">
	</div>
	<!--End弹窗-->
	
	<!-- 老师组织架构 start-->
	<div id="ls_div_box" class="weui_tab tab-bottom" style="display:none;z-index: 600;background-color: #f8f8f8;">
		<div class="weui_tab_bd">
	        <div class="weui-header bg-blue"> 
	        	<div class="weui-header-left" id="teacherBack"> <a class="icon icon-109 f-white">取消</a>  </div>
				<h1 class="weui-header-title">石门附小组织架构</h1>
			</div>
	        
	        <!--下拉选择-->
	        <div class="page-bd">  
		         <ul id="teacherList">
		     	 </ul>
		    </div>
	    	<script id="teacher-table-template" type="text/x-handlebars-template">	
 				{{#each list}}
					<li class="list1">
		                <div class="weui-flex">
		                   	<p class="weui-flex-item js-category"> {{groupName}}</p>
		                    <span class="js-category"><i class="icon icon-74"></i> 下级</span>
		                </div>
		                <div class="page-category js-categoryInner">
							<div class="weui_cells" style="margin: 0;">
								<ul class="list_3">
								{{#each subList}}
						            <li><div class="weui_cell_hd list_c3" style="display: inline-flex;padding-left: 10px;">
											<label class="weui_cells_checkbox weui_check_label" style="padding-right: 15px;" for="{{groupId}}_{{teacherId}}">
												<input type="checkbox" class="weui_check" value="{{teacherId}}" id="{{groupId}}_{{teacherId}}">
					        					<i class="weui_icon_checked"></i>
											</label>
											<label class="tea_name">{{teacherName}}</label>
										</div>
									</li>
								{{/each}}
								</ul>
							</div>
		                </div>
		            </li>
				{{/each}}
			</script>
	    <!--End下拉选择-->
		</div>
	</div>
	
</body>
<jsp:include page="/WEB-INF/page/common/_footer.jsp"></jsp:include>
<script>
	var teacherData = {};
	$(function() {
		initApprover();
		$('#btnSubmit').on('click', function() {
			submit();
		});
		//老师组织架构返回
		$("#teacherBack").click(function() {
			$('.ueureiu').hide();
			$("#ls_div_box").hide();
		});
		//老师组织架构弹出
	  	$("#addBtn").click(function() {
	  		//上下级拉动
			$("#teacherList .js-category").each(function(i, v) {
	    		v.removeEventListener("click", categoryClick, false);
	    		v.addEventListener('click', categoryClick);
	    	})
	  		$('.ueureiu').show();
	  		$("#ls_div_box").show();
			$(".list_c3 input").change(function() {
				var obj = $(this);
				var name = obj.closest(".list_c3").find(".tea_name").html();
				$(".gzsp_wrap>ul").html("");
				$(".gzsp_wrap>ul").append("<li><div class='gzsp'><span>"+name.substr(name.length-2,name.length)+"</span><i data-id='"+obj.val()+"'>"+name+"</i></div></li>");
				$("#teacherBack").click();
			});
	  	})
	});
	function eventInit() {}
	function submit() {
		var printingPaperUse = $('#printingPaperUse').val();
		if(printingPaperUse.length == 0) {
			$.alert("请输入打印纸用途！","");
			return;
		}
		var usePosition = $('#usePosition').val();
		if(usePosition.length == 0) {
			$.alert("请输入使用地点！","");
			return;
		}
		var tmpApplyItems = ApplyItemsData();
		if(tmpApplyItems == null) return;
		var aObj = $($(".gzsp_wrap").find(".gzsp i"));
		var approverId = emptyToNull(aObj.attr("data-id"));
		if(approverId == null) {
			$.alert("请选择审批人", "");
			return;
		}
		$.confirm("提交申请后2个小时内可以撤销申请", "确认提交申请?", function() {
			$.ajax({
				url: basePath + '/ls/work/approval/apply/submit',
				type: 'post',
				dataType: 'json',
				data: {
					approver: aObj.html(),
					approverId: approverId,
					approvalType: '${approvalType}',
					printingPaperUse: printingPaperUse,
					usePosition: usePosition,
					applyItems: tmpApplyItems
				},
				success: function(data) {
					if (data.code == '000') {
						$.toast("申请提交成功！");
						setTimeout(function(){
							window.location.href = basePath + "/ls/work/approval?v=" + new Date().getTime();
						}, 1000);
					} else {
						$.toptips(data.msg);
					}
				}
			});
		}, function() {
        });
	}
	function ApplyItemsData () {
		var tmpDOM = $('#getHtml').find('.no');
		var tmpString = '';
		var isOk = true;
		tmpDOM.each(function(i, e) {
			var list = $(e).find(".weui_template");
			list.each(function(y, ey) {
				var text = $(ey).find('.weui_template_text').text();
				var val = $(ey).find('.weui_template_val').val();
				if(val.length == 0) {
					$.alert("还有明细未填写完，请核实！","");
					isOk = false;
					return false;
				}
				tmpString += text + '|' + val;
				if((y+1) < list.length) tmpString += ",";
			});
			if((i+1) < tmpDOM.length)tmpString += ";";
		});
		if(!isOk) return null;
		return tmpString;
	}

	function initApprover() {
		$.ajax({
			url: basePath + '/ls/work/approval/approver',
			type: 'post',
			dataType: 'json',
			data: {
				approvalType: '${approvalType}'
			},
			success: function(data) {
				if(data.data.approvalerId != null && data.data.approvalerId != undefined){
					$(".gzsp_wrap").find("div").remove();
					var name = data.data.approvaler;
					$(".gzsp_wrap>ul").append("<li><div class='gzsp'><span>"+name.substr(name.length-2,name.length)+"</span><i data-id='"+data.data.approvalerId+"'>"+name+"</i></div></li>");
				}else {
					teacherData.list = data.data;
	 				loadTeacherHtml(teacherData);
				}
			}
		});
	}
	function loadTeacherHtml(teacherData) {
		var myTemplate = Handlebars.compile($("#teacher-table-template").html());
			Handlebars.registerHelper("equal", function(v1,v2,options) {
    		if(v1 == v2) {
    			//满足添加继续执行
    			return options.fn(this);
    		}else {
    			//不满足条件执行{{else}}部分
    			return options.inverse(this);
    		}
    	});
		$('#teacherList').html(myTemplate(teacherData));
	}
	function categoryClick() {
		$parent = $(this).closest('li');
		if($parent.hasClass('js-show')){
            $parent.removeClass('js-show');
            $parent.find('i').removeClass('icon-35').addClass('icon-74');
        }else{
            $parent.siblings().removeClass('js-show');
            $parent.addClass('js-show');
            $parent.siblings().find('i').removeClass('icon-35').addClass('icon-74');
            $parent.find('i').removeClass('icon-74').addClass('icon-35');
        }
	}
</script>
</html>